<template>
  <div class="app">
<!--    <div class="ql-container ql-snow" style="border: 1px solid #ffffff;">-->
<!--      <div class="ql-editor" style="font-size: 16px">-->
<!--        <div v-html="typedText"></div>-->
<!--      </div>-->
<!--    </div>-->
<!--    <vue-markdown :source="typedText"></vue-markdown>-->
    <dv-capsule-chart :config="config" style="width:50vh;height:50vh" />
  </div>
</template>

<script>
import { getAIToRd } from "@/api/gqgl/rdb";
import VueMarkdown from 'vue-markdown';

export default {
  name: "index",
  // components: {
  //   VueMarkdown
  // },
  data() {
    return {
      config: {
        data: [
          {
            name: '专利生命周期价值（LTV）',
            value: 0.35
          },
          {
            name: '技术领域相关性',
            value: 0.28
          },
          {
            name: '发明人背景评分',
            value: 0.20
          },
          {
            name: '引用次数',
            value: 0.15
          },
          {
            name: '专利规模',
            value: 0.12
          },
          {
            name: '权利要求数量',
            value: 0.10
          },
          {
            name: '专利年龄',
            value: 0.08
          },
          {
            name: '法律状态',
            value: 0.05
          }
        ],
        showValue: true
      },
      text: "", // 初始为空，稍后通过API填充
      typedText: '',
      index: 0,
      typingSpeed: 20, // 调整至合适的打字速度(ms每字符)
    }
  },
  // mounted() {
  //   this.fetchData();
  // },
  methods: {
    // fetchData() {
    //   this.$modal.loading("正在导出数据，请稍后...");
    //   getAIToRd("你好").then(res => {
    //     this.text = res.msg; // 假设返回的数据结构中有msg字段包含所需文本
    //     this.typeWriter(); // 获取数据后开始逐字显示
    //     this.$modal.closeLoading();
    //   });
    // },
    // typeWriter() {
    //   if (this.index < this.text.length) {
    //     this.typedText += this.text.charAt(this.index);
    //     this.index++;
    //     setTimeout(this.typeWriter, this.typingSpeed); // 使用setTimeout实现逐字显示
    //   }
    // }
  }
}
</script>

<style scoped>
/* 样式保持不变 */
.app {
  position: relative;
  background:  center center no-repeat, #040505; /*添加背景图片和颜色*/
  background-size: cover;
  width: 100%;
  height: calc(100vh);
  border: 1px solid #0C1723;
  overflow: hidden; /* 防止 leftpart 超出 wrap */
}
</style>
